<template>
    <AdaptiveNavBar title="纤程旅行" :showBack="true" :showHome="false" />
    <view class="content-area" :style="{ marginTop: $navbarUtil.getNavbarTotalHeightRpx() }">
    <view class="login-container">
		<view class="logo-section">
			<!-- 应用Logo -->
			<image src="https://big-event-kda.oss-cn-beijing.aliyuncs.com/wjj/logo.png" class="logo" mode="aspectFill">
			</image>
			<!-- 欢迎文字 -->
			<text class="welcome-text">欢迎使用纤程旅行</text>
		</view>

		<!-- 协议同意区域 -->
		<view class="agreement-section">
			<view class="agreement-checkbox" @click="toggleAgreement">
				<view class="checkbox" :class="{ 'checked': isAgreedToAgreement }">
					<uni-icons type="success" size="24" color="#fff" v-if="isAgreedToAgreement"></uni-icons>
				</view>
				<text class="agreement-text">我已阅读并同意</text>
			</view>
			<view class="agreement-links">
				<text class="agreement-link" @click="showAgreementDetail">《纤程旅行平台服务协议》</text>
				<text class="agreement-divider">和</text>
				<text class="agreement-link" @click="showPrivacyPolicy">《隐私保护政策》</text>
			</view>
		</view>

		<!-- 一键登录区域 -->
		<view class="login-section">
			<!-- 微信授权登录按钮 -->
			<button class="one-click-login-btn" type="primary" open-type="getPhoneNumber"
				@getphonenumber="handleOneClickLogin" v-if="!isLoading" :disabled="!isAgreedToAgreement">
				微信授权登录
			</button>

			<!-- 加载中状态 -->
			<button class="one-click-login-btn loading" type="primary" v-else :disabled="true">
				{{ loadingText }}
			</button>
		</view>

		<!-- 使用uview-plus的弹窗组件 -->
		<u-popup ref="agreementPopup" mode="bottom" :show="showPopup" @close="onPopupClose" :mask-close-able="false">
			<view class="popup-container">
				<view class="popup-header">
					<text class="popup-title">{{ popupTitle }}</text>
					<u-icon name="close" size="28" @click="closeAgreementPopup"></u-icon>
				</view>
				<scroll-view class="popup-content" scroll-y>
					<view v-if="currentContent === 'agreement'" class="agreement-content">
						<text class="agreement-title">纤程旅行平台服务协议</text>
						<text class="agreement-date">发布日期：2025年9月03日
							生效日期：2025年9月03日</text>
						<text class="agreement-paragraph">尊敬的【用户】与【商户】：
							欢迎您使用纤程旅行平台服务！</text>
						<text class="agreement-paragraph">【审慎阅读】
							在您点击同意本协议之前，请您务必审慎阅读、充分理解各条款内容，特别是以粗体标识的条款。这些条款可能涉及免除或限制责任、法律适用与争议解决等重要内容。您应重点阅读，并在确认接受其约束后，再进行后续操作。</text>
						<text class="agreement-paragraph">【签约动作】
							当您按照注册页面提示填写信息、阅读并同意本协议，且完成全部注册程序后，即表示您已充分阅读、理解并接受本协议的全部内容，正式成为纤程旅行平台的【用户】或【商户】（以下统称"您"）。您的阅读、理解及点击同意行为，即视为您与得炼（郑州）信息科技有限公司（以下简称"纤程旅行"或"平台"）已达成本协议，并同意接受本协议及其他平台规则的约束。</text>
						<text class="agreement-paragraph">【协议构成】
							1.1
							本协议由《纤程旅行平台服务协议》正文、附件及平台已发布或将来可能发布的各项规则（包括但不限于《隐私保护政策》、《商户入驻与资质管理规范》、《商户管理与履约保障办法》、《研学旅游服务运营管理规范》、《争议调解处理规范》等）共同组成。
							1.2
							所有规则为本协议不可分割的组成部分，与本协议正文具有同等法律效力。若规则与本协议正文存在冲突，应以规则的特殊规定为准；若不同规则之间存在冲突，应以发布在后的或要求更严格的规则为准。</text>
						<text class="agreement-paragraph">第一章 定义与解释
							第1条 相关定义
							除非本协议另有规定，下列术语在本协议中的含义为：
							1.1 平台/纤程旅行：指由得炼（郑州）信息科技有限公司运营的，包括但不限于域名以qctrips.cn为主的网站、客户端应用程序、微信小程序、H5页面等在内的网络平台。
							1.2 用户：指在平台注册或未注册，浏览、搜索、购买、预订商品或服务的自然人。
							1.3 商户：指在平台注册并通过认证，使用平台服务发布、销售商品或服务的企业、组织或个体工商户。
							1.4 其他商户：指在平台上通过在线购买、协作、调用并转售其他商户商品/服务的商户。
							1.5 订单：指用户与其他商户通过平台达成的，约定购买特定商品或服务的交易凭证。
							1.6 财付通：指财付通支付科技有限公司，是平台指定的第三方支付机构。
							1.7 交易金额：指订单的实际支付金额与平台补贴（如有）之和。</text>
						<text class="agreement-paragraph">第十一章 法律适用、管辖与其他
							第22条 法律适用与管辖
							22.1 本协议的订立、效力、解释、履行和争议的解决，均适用中华人民共和国大陆地区法律。
							22.2 因本协议引起的任何争议，双方应首先友好协商解决；协商不成的，任何一方均有权将争议提交至平台住所地（河南省郑州市）有管辖权的人民法院诉讼解决。
							第23条 通知
							平台可通过网站公告、站内信、短信、电子邮件或您在平台预留的联系电话等方式向您发送通知。该等通知于发送之日视为已送达。
							第24条 其他
							24.1 本协议任何条款部分无效，不影响其他部分的效力。
							24.2 本协议未尽事宜，应按平台相关规则及中华人民共和国相关法律法规执行。</text>
						<text class="agreement-paragraph">协议方确认：
							平台方：得炼（郑州）信息科技有限公司
							用户/商户：【 】（点击同意即代表您本人或您所代表的法人实体）
							温馨提示：在点击同意前，请您再次确认已完全理解本协议及各附属规则的全部内容。</text>
					</view>
					<view v-else class="privacy-content">
						<!-- 完整的隐私保护政策内容 -->
						<text class="agreement-title">隐私保护政策</text>
						<text class="agreement-date">更新日期：2025年09月03日
							生效日期：2025年09月03日</text>
						<text class="agreement-paragraph">一、 引言与概述
							欢迎与运营方：欢迎使用纤程旅行（域名为 www.qctrips.cn），由得炼（郑州）信息科技有限公司运营。
							特别提示：请您在使用服务前，仔细阅读并理解本政策，特别是加粗下划线的内容。您的使用行为即表示同意本政策。
							政策独立性：本政策仅适用于纤程旅行平台。平台内包含的第三方服务（如链接、支付、地图等）有其独立的隐私政策，请注意查阅。
							协议优先级：本政策为平台核心隐私协议。若与其他协议存在冲突，以本政策为准；若与法律法规冲突，以法律法规为准。</text>
						<text class="agreement-paragraph">二、 信息的收集与使用
							我们遵循"正当必要、知情同意"的原则，在以下场景收集和使用您的信息：
							（一） 通用信息收集场景
							账号注册与管理：为完成注册、实名制及账号安全，我们会收集您的手机号或邮箱（必选）。您可选填性别、地区等信息以获得个性化服务。欲成为商户，需提供身份证件信息。</text>
						<text class="agreement-paragraph">基础服务运行：为保障小程序基础功能的正常运行，我们致力于遵循数据最小化原则：
							我们不会主动收集您的设备信息（如设备型号、操作系统）或网络日志（如IP地址）。
							我们依赖微信小程序平台自身的安全风控与性能监控能力。任何由微信平台方统一提供的、已匿名化处理的统计信息（如总用户数、故障率），仅用于我们优化服务体验，无法识别特定个人身份。</text>
						<text class="agreement-paragraph">位置相关服务：为了提供搜索、导航、附近推荐等服务，在获得您授权后，我们会收集您的精确或粗略地理位置信息。

							内容发布与互动：当您发布动态、评价或使用即时通讯功能时，我们会请求相机、相册、麦克风权限，并收集您上传的图片、视频、文字及加密后的聊天记录。</text>
						<text
							class="agreement-paragraph">交易与支付：为您预订旅游、研学、课程等商品/服务，我们需要收集出行人/参与者的姓名、证件号、联系方式。支付时，我们会与第三方支付机构共享必要的订单信息（订单号、金额）和身份信息（姓名、账户）
							以完成交易。

							第三方账号登录：当您使用微信、QQ等第三方账号登录时，我们会从第三方处获取您授权共享的账号信息（如昵称、头像），并收集必要的设备信息以完成登录安全验证。</text>
						<text class="agreement-paragraph">（二） 未成年人信息收集场景

							监护人与授权：若您作为监护人为未成年人预订服务，您需提供未成年人姓名、证件号、年龄、性别、联系方式等敏感信息。此行为即代表您已同意我们按本政策处理该信息。

							无法识别情形：对于浏览、搜索等无需主动提供信息的功能，我们通常无法识别使用者是否为未成年人，此类信息按通用规则处理。</text>
						<text class="agreement-paragraph">（三） 无需征得授权同意的情形
							根据相关法律法规，以下情形中我们收集、使用您的个人信息无需征得您的授权同意：
							与履行法律法规规定的义务相关的；
							与国家安全、国防安全、公共安全、公共卫生、重大公共利益直接相关的；
							与犯罪侦查、起诉、审判和判决执行等直接相关的；
							出于维护您或他人的生命、财产等重大合法权益但又很难得到本人同意的；
							所收集的信息是您自行向社会公众公开的；
							从合法公开披露的信息中收集的；
							用于维护服务的安全稳定运行所必需的（如故障诊断）。</text>
						<text class="agreement-paragraph">三、 信息的共享、转让与公开披露
							（一） 共享
							我们仅在以下情况下与第三方共享您的信息，并会对其进行严格的安全评估与约束：
							服务提供商：为向我们提供基础设施技术、支付、数据处理、客户服务等支持的合作方（如云服务商、银行、支付机构）。
							业务合作伙伴：为实现具体服务功能所必须的合作伙伴，如研学主办方、旅行社、酒店、运输公司，以便其为您提供预订的服务。
							关联公司：为协同向我们及其关联公司的用户提供产品及服务，但我们会要求其遵守本政策。
							纠纷处理：当发生投诉、纠纷时，为解决问题，我们可能会应消费者权益保护部门或监管机构的要求共享必要的纠纷信息。</text>
						<text class="agreement-paragraph">（二） 转让
							我们不会将您的个人信息转让给任何公司、组织或个人，除非事先获得您的明确同意；
							在涉及合并、收购、资产转让或类似交易时，我们会要求新的持有您信息的公司、组织继续受本政策的约束。

							（三） 公开披露
							我们仅在以下情况下公开披露您的个人信息：
							获得您的明确同意；
							基于法律、法律程序、诉讼或政府主管部门的强制性要求。</text>
						<text class="agreement-paragraph">四、 Cookie与同类技术
							我们使用Cookie和类似技术来存储您的偏好、位置等数据，以优化您的体验（如免重复登录、个性化推荐）。您可通过浏览器设置管理Cookie，但禁用可能会影响部分服务功能。</text>
						<text class="agreement-paragraph">五、 您的权利
							您有权管理您的个人信息，具体可通过"纤程旅行"微信小程序内"我的"相关入口或联系客服实现：
							访问与更正：您可以访问和更正您的账号信息、营员信息等。
							删除与撤回授权：您可以删除您发布的内容。在特定情况下（如我们违法处理信息、您撤回同意、注销账号），您可以要求删除个人信息。您也可以通过关闭设备权限、更改App内设置来撤回部分授权。
							注销账号：您可以通过在线客服或"我的-账户-注销"功能申请注销账号。注销后，我们将停止收集并使用您的信息，但会根据法律法规要求对历史交易信息进行留存。

							响应您的请求：为保障安全，您行使权利时我们可能需要验证您的身份。我们将在15个工作日内回复您的请求。</text>
						<text class="agreement-paragraph">六、 信息的存储与保护
							存储地点：所有个人信息将存储在中华人民共和国境内。
							存储期限：我们仅为实现目的所必需的最短时间保留您的信息（法律法规另有规定的除外，如交易信息自交易完成之日起不少于3年）。

							安全措施：我们采用数据加密、访问控制、安全审计、匿名化处理等多种技术和管理措施保护您的信息安全，并制定了安全事件应急预案。</text>
						<text class="agreement-paragraph">七、 未成年人信息保护
							我们高度重视未成年人信息的保护：
							若您是未成年人，请在监护人指导下使用我们的服务。
							监护人应妥善保管账号密码，并同意我们按本政策处理未成年人信息。
							我们严格限制内部人员对未成年人信息的访问权限。
							若发生未成年人信息安全事件，我们将依法及时通知监护人和监管部门。</text>
						<text class="agreement-paragraph">八、 政策的变更与联系我们
							变更：我们可能适时修订本政策。若该修订会削减您已享有的权利，我们将通过显著方式（如弹窗、公告）通知您。若您继续使用我们的服务，即表示同意修订后的政策。
							联系我们：如您对本政策有任何疑问、意见或投诉，请通过以下方式联系我们：
							客服邮箱：qctrips@126.com
							客服电话：185 6999 8668
							为高效处理问题，请在投诉中提供：您的账号、姓名、联系方式、具体投诉请求和理由、相关证据。</text>
					</view>
				</scroll-view>
				<view class="popup-footer">
					<button class="popup-btn" type="primary" @click="closeAgreementPopup">我知道了</button>
				</view>
			</view>
		</u-popup>
    </view>
    </view>
</template>

<script>
import { weixinLogin } from '@/utils/login';
import { useUserStore } from '@/store';
import { HOME_ROUTE_MAP } from '@/config/app';

export default {
	data() {
		return {
			phoneCode: null,
			isLoading: false,
			loadingText: '登录中...',
			isAgreedToAgreement: false,
			popupTitle: '',
			currentContent: '',
			showPopup: false // 控制弹窗显示状态
		};
	},
	onLoad() {
		// 页面加载时的初始化
	},
	methods: {

		// 切换协议同意状态
		toggleAgreement() {
			this.isAgreedToAgreement = !this.isAgreedToAgreement;
		},

		// 显示协议详情
		showAgreementDetail() {
			this.popupTitle = '纤程旅行平台服务协议';
			this.currentContent = 'agreement';
			this.showPopup = true;
		},

		// 显示隐私政策
		showPrivacyPolicy() {
			this.popupTitle = '隐私保护政策';
			this.currentContent = 'privacy';
			this.showPopup = true;
		},

		// 关闭协议弹窗
		closeAgreementPopup() {
			this.showPopup = false;
		},

		// 弹窗关闭时的回调
		onPopupClose() {
			this.showPopup = false;
		},


		// 一键登录逻辑
		async handleOneClickLogin(e) {
			console.log('handleOneClickLogin', e);

			// 检查协议同意状态
			if (!this.isAgreedToAgreement) {
				uni.showToast({
					title: '请先阅读并同意用户协议',
					icon: 'none'
				});
				return;
			}

			// 检查手机号授权
			if (e.detail.errMsg !== 'getPhoneNumber:ok') {
				console.log('用户取消手机号授权');
				uni.showToast({
					title: '需要手机号授权才能登录',
					icon: 'none'
				});
				return;
			}

			try {
				// 显示加载中
				this.isLoading = true;
				this.loadingText = '登录中...';

				// 获取手机号code
				this.phoneCode = e.detail.code;

				// 准备登录参数（只需要手机号code）
				const loginParams = {
					phoneCode: this.phoneCode
				};

				console.log('准备登录参数:', loginParams);
				// 调用登录函数
				const success = await weixinLogin(null, loginParams);

				if (success) {
					console.log('success', success)
					// 登录成功提示
					uni.showToast({
						title: '登录成功',
						icon: 'success',
						duration: 1500
					});

					// 延迟跳转，让用户看到成功提示
					setTimeout(() => {
						// 登录成功后，跳转到默认首页
						const userStore = useUserStore();
						const targetRoute = HOME_ROUTE_MAP[userStore.role] || HOME_ROUTE_MAP.user;
						uni.reLaunch({ url: targetRoute });
					}, 1500);
				}
			} catch (error) {
				console.error('登录失败:', error);
				uni.showToast({
					title: '登录失败，请重试',
					icon: 'none'
				});
			} finally {
				this.isLoading = false;
			}
		}
	}
};
</script>

<style scoped>
.content-area {
    /* 占位容器，顶置自定义导航栏高度 */
}
.login-container {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 60rpx 40rpx;
	min-height: 100vh;
	box-sizing: border-box;
	background-color: #f8f8f8;
	justify-content: space-between;
}

.logo-section {
	margin-bottom: 60rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
}

.logo {
	width: 200rpx;
	height: 200rpx;
	border-radius: 50%;
	border: 2rpx solid #eee;
}

.welcome-text {
	margin-top: 30rpx;
	font-size: 32rpx;
	color: #333;
	font-weight: 500;
	text-align: center;
}

/* 调整登录区域样式，确保在底部 */
.login-section {
	width: 100%;
	margin-top: 60rpx;
	margin-bottom: 20rpx;
}

.one-click-login-btn {
	background-color: #07c160;
	color: #fff;
	height: 90rpx;
	line-height: 90rpx;
	font-size: 32rpx;
	border-radius: 10rpx;
	width: 100%;
	box-shadow: 0 4rpx 20rpx rgba(7, 193, 96, 0.3);
	transition: all 0.3s ease;
}

.one-click-login-btn[disabled] {
	background-color: #ccc;
	color: #fff;
	box-shadow: none;
}

.one-click-login-btn:not([disabled]):active {
	transform: translateY(2rpx);
	box-shadow: 0 2rpx 10rpx rgba(7, 193, 96, 0.2);
}

.one-click-login-btn.loading {
	background-color: #1989fa;
}

.one-click-login-btn.disabled {
	background-color: #ccc !important;
	color: #999 !important;
	box-shadow: none !important;
}

.agreement-section {
	width: 100%;
	margin-top: 20rpx;
}

.agreement-checkbox {
	display: flex;
	align-items: center;
	margin-bottom: 10rpx;
	padding: 0 10rpx;
}

.checkbox {
	width: 30rpx;
	height: 30rpx;
	border: 2rpx solid #ccc;
	border-radius: 6rpx;
	margin-right: 10rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}

.checkbox.checked {
	background-color: #1989fa;
	border-color: #1989fa;
}

.agreement-text {
	font-size: 26rpx;
	color: #666;
}

.agreement-links {
	display: flex;
	margin-top: 12px;
	margin-left: 14px;
	align-items: center;
	flex-wrap: wrap;
	padding: 0 10rpx;
}

.agreement-link {
	font-size: 26rpx;
	color: #1989fa;
}

.agreement-divider {
	font-size: 26rpx;
	color: #666;
	margin: 0 10rpx;
}

/* 优化弹窗样式，解决文字超出屏幕问题 */
.popup-container {
	width: 100%;
	max-height: 80vh;
	background-color: #fff;
	border-radius: 20rpx 20rpx 0 0;
	box-sizing: border-box;
}

.popup-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 30rpx 40rpx;
	border-bottom: 1rpx solid #eee;
	box-sizing: border-box;
}

.popup-title {
	font-size: 32rpx;
	font-weight: 600;
	color: #333;
}

.popup-content {
	height: 60vh;
	padding: 30rpx 40rpx;
	box-sizing: border-box;
}

/* 关键优化：添加文字换行和断词属性 */
.agreement-content,
.privacy-content {
	font-size: 28rpx;
	color: #333;
	line-height: 48rpx;
	word-wrap: break-word;
	word-break: break-all;
	white-space: pre-wrap;
}

.agreement-title {
	font-size: 34rpx;
	font-weight: 600;
	color: #333;
	margin-bottom: 30rpx;
	display: block;
	text-align: center;
}

.agreement-date {
	font-size: 26rpx;
	color: #999;
	margin-bottom: 30rpx;
	display: block;
	text-align: center;
}

.agreement-paragraph {
	font-size: 28rpx;
	color: #333;
	line-height: 48rpx;
	margin-bottom: 30rpx;
	display: block;
	white-space: pre-wrap;
	word-wrap: break-word;
	word-break: break-all;
}

.popup-footer {
	padding: 30rpx 40rpx;
	border-top: 1rpx solid #eee;
	box-sizing: border-box;
}

.popup-btn {
	background-color: #1989fa;
	color: #fff;
	height: 90rpx;
	line-height: 90rpx;
	font-size: 32rpx;
	border-radius: 10rpx;
	width: 100%;
}
</style>